
import React, { useContext, forwardRef } from 'react'
import CustomizeModal, { CustomizeModalButton, CustomizeModalContext } from "@common/presentational/CustomizeModal";
import { Button, Col } from "antd";
const SelectTypeContent = props => {
    const { hide } = useContext(CustomizeModalContext)
    const { callback } = props

    return (
        <div className="select-account-type-box">
            <div className="select-account-box">
                <div className="ft-14 ft-w600 ft-clr-d mgb-12">小微商户</div>
                <p className="ft-clr-l ft-12">无需营业执照，只需身份证，即可快速完成审批；</p>
                <p className="ft-clr-l ft-12">正常日收款额度为10万，根据交易适当提额</p>
                <Button type="primary" ghost className="mgt-24"
                    onClick={() => {
                        hide()
                        callback(1)
                    }}
                >开通</Button>
            </div>
            <div className="select-account-box">
                <div className="ft-14 ft-w600 ft-clr-d mgb-12">个体工商户</div>
                <p className="ft-clr-l ft-12">需要身份证、营业执照（主体为个体户、个人工商户或个体经营）</p>
                <p className="ft-clr-l ft-12">收款不限额度，1-2个工作日内完成审批</p>
                <Button type="primary" ghost className="mgt-24"
                    onClick={() => {
                        hide()
                        callback(2)
                    }}
                >开通</Button>
            </div>
            <div className="select-account-box">
                <div className="ft-14 ft-w600 ft-clr-d mgb-12">企业商户</div>
                <p className="ft-clr-l ft-12">需要身份证、营业执照（主体为有限公司、有限责任公司）</p>
                <p className="ft-clr-l ft-12">收款不限额度，1-2个工作日内完成审批</p>
                <Button type="primary" ghost className="mgt-24"
                    onClick={() => {
                        hide()
                        callback(3)
                    }}
                >开通</Button>
            </div>
        </div>
    )
}

export default forwardRef((props, ref) => (
    <CustomizeModal width={800} title="选择开通类型" ref={ref}>
        <SelectTypeContent {...props} />
    </CustomizeModal>
))
